<template>
	<wsPage title="操作日志列表">
		<div slot="page_operate">
			<Button type="ghost" @click="query"><Icon type="refresh"></Icon><span>刷新</span></Button>
		</div>
		<wsSmPanel :page="table.page" @simple-query="query" @page-change="query">
			<div slot="query_form">
				<Form :model="queryForm" :label-width="100" inline>
					<FormItem label="查询发送时间段">
						<Row>
		                <Col span="11">
		                    <FormItem prop="date">
		                        <DatePicker type="date" placeholder="查询开始时间" v-model="queryForm.searchStartTime" @on-change="dateConfirm"></DatePicker>
		                    </FormItem>
		                </Col>
		                <Col span="2" style="text-align: center">-</Col>
		                <Col span="11">
		                    <FormItem prop="date">
		                        <DatePicker type="date" placeholder="查询结束时间" v-model="queryForm.searchEndTime" @on-change="dateConfirm"></DatePicker>
		                    </FormItem>
		                </Col>
		            </Row>      
			        </FormItem>
			        <FormItem label="模块名称">
			            <Input v-model="queryForm.moduleName" placeholder="请输入"></Input>
			        </FormItem>
				</Form>
			</div>
			<div slot="list_operate">
				
			</div>
			<div slot="list_data">
				<Table border :columns="table.columns" :data="table.data" @on-selection-change="tableSelected"></Table>
			</div>
		</wsSmPanel>
		

	</wsPage>
</template>

<script>
	import Util from '../../../common/util.js';
	export default {
		data() {
			return {
				queryForm: {
					searchStartTime: '',
					searchEndTime:'',
					systemType:2,
					moduleName:''
				},
				table: {
					columns: [{
						title: '系统类型',
                        key: 'systemType',
                        width: 200,
                        align: 'center',
                        render: (h, params) => {
                        	return h('span', {
                        		
                        	}, params.row.systemType == 1?'运营系统':(smsModal.form.type == 2)?'商户系统':'基地系统')
                        }
					},{
						title: '模块名称',
                        key: 'moduleName',
                        width: 200,
                        align: 'center'
					},{
						title: '操作名称',
                        key: 'operateName',
                        width: 200,
                        align: 'center'
					},{
						title: '操作系统',
                        key: 'osName',
                        width: 260,
                        align: 'center'
					},{
						title: '创建时间',
                        key: 'createDate',
                        align: 'center'
					}],
					data: [],
					page: {
						total: 0, //总条数
						pageNum: 1, //当前页
						pageSize: 10 //每页显示条数
					},
					selection: [], //选中
					loading: true
				}
			}
		},
		computed: {
			/**
			 * 表格行是否为选中状态
			 */
			isTableSelected() {
				return this.table.selection.length > 0;
			}	
		},
		mounted() {
			this.init();
		},
		methods: {
			init() {
				this.query();
			},
			/**
			 * 表单查询
			 */
			query() {
				let pageSize = this.table.page.pageSize;
				let pageNum = this.table.page.pageNum;
				const _this = this;
				this.axios.post('/ws/sys/operationLog?pageNum=' + pageNum + '&pageSize=' + pageSize, this.queryForm).then(response => {
					var res = response.data;
					var resMeta = res.meta;
					if (0 == resMeta.code) {
						_this.buildPageData(res.data);
					} else {
						_this.$Message.warning(resMeta.message);
					}
				});
			},
			//查询开始时间段必填
			dateConfirm(){
				let searchStartTime = this.queryForm.searchStartTime;
				let searchEndTime = this.queryForm.searchEndTime;
				if (searchStartTime != null ||searchStartTime != '') {
					searchEndTime = new Date();
				} else if (searchEndTime != null || searchEndTime !='') {
					searchStartTime = searchEndTime;
				} 
			},
			/**
			 * 构建表格数据
			 */
			buildPageData(data_) {
				this.table.data = data_.list;
				this.table.page.total = data_.total;
			},
			/**
			 * 表格选择变更事件
			 */
			tableSelected(selection_) {
				this.table.selection = selection_;
			}
		}
	}
</script>

<style scoped>
	.ws-form-select {
		width: 162px;
	}
</style>